<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>用户文件上传</title>
    <link rel="stylesheet" href="../../layui/css/layui.css" />
    <script src="../../layui/layui.js" charset="utf-8"></script>
    <style>
        .anniu {
            margin-right: 15px;
        }

        .seasel {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
        }

        .dv {
            height: 120px;
        }

        .layui-upload-drag {
            line-height: initial;
        }

        .layui-layer-content {
            text-align: center;
        }
    </style>
</head>

<body>
    <div style="padding: 20px; background-color: #f2f2f2">
        <div class="layui-card" style="background-color: #fff">
            <div class="layui-card-body">
                <!-- 顶部按钮 -->
                <form class="layui-form" action="" lay-filter="saixuan">
                    <div class="seasel">
                        <div class="btn">
                            <button type="button" class="layui-btn" onclick="daoru()"> <i
                                    class="layui-icon layui-icon-addition"></i>&nbsp;&nbsp;上传文件</button>
                            <button type="button" class="layui-btn" onclick="shanchu()"><i
                                    class="layui-icon layui-icon-delete"></i>&nbsp;&nbsp;批量删除</button>
                        </div>
                        <div class="seasel">


                            <div class="layui-inline">
                                <input type="text" name="keyWords" required lay-verify="required" placeholder="查询内容或字段"
                                    autocomplete="off" class="layui-input" />
                            </div>
                            <div class="layui-inline">
                                <button type="button" class="layui-btn" onclick="chaxun()">
                                    <i class="layui-icon layui-icon-search"></i>&nbsp;&nbsp;
                                    查询
                                </button>
                            </div>
                        </div>
                    </div>
                </form>
                <!-- 底部表格 -->
                <table class="layui-hide" id="wenjian" lay-filter="wenjian1"></table>
            </div>
        </div>
    </div>

    <div style="display: none" id="bar">
        <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit">编辑</a>

        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </div>


    <script>
        var url = "http://47.105.118.98:9013";
        var ins1;
        var table;
        var form;
        var upload;
        var option = {
            elem: "#wenjian",
            id: "wenjian1",
            url: url + "/document/querybyuserid",
            method: "get",
            headers: {
                token: localStorage.getItem("token"),
            },
            request: {
                pageName: "currentPage", //页码的参数名称，默认：page
                limitName: "size", //每页数据量的参数名，默认：limit
            },
            where: {
                userid: localStorage.getItem("id"),
                // keywords: "",
            },

            parseData: function (res) {

                console.log(res);

                return {
                    code: "0",
                    data: setData(res.data.records),
                    count: res.data.total,
                };

            },
            height: "full-120",
            text: {
                none: "暂无数据", //默认：无数据。注：该属性为 layui 2.2.5 开始新增
            },
            page: true,
            cols: [
                [{
                    type: "checkbox",
                    width: 80,
                    fixed: "left",
                },
                {
                    field: "xvhao",
                    type: "numbers",
                    title: "序号",
                    align: "center",
                    width: 80,
                },


                {
                    field: "name",
                    title: "包机人",
                    align: "center",
                },
                // {
                //     field: "phone",
                //     title: "手机号",
                //     align: "center",
                // },
                {
                    fixed: "right",
                    width: 120,
                    title: "操作",
                    toolbar: "#bar",
                    align: "center",
                },
                ],
            ],
        };

        function setData(data) {
            console.log(data);
            data.forEach((item) => {

            });
            return data;
        }
        layui.use(["table", "form", "jquery", "upload"], function () {
            table = layui.table;
            form = layui.form;
            upload = layui.upload;
            $ = layui.jquery;
            ins1 = table.render(option);



            //监听行工具事件
            table.on("tool(wenjian1)", function (obj) {
                var data = obj.data;

                switch (obj.event) {
                    case "edit":
                        goEdit(data);
                        break;
                    case "del":
                        layer.confirm("请确认是否删除", function (index) {
                            //向服务端发送删除指令
                            var data3 = {};
                            data3.machineOwnerIds = data.id;

                            $.ajax({
                                // url: url + "machineOwner/del",
                                method: "post",
                                traditional: true, //防止深度序列化
                                data: data3,
                                success: function (data) {

                                    if (data.code == 1) {
                                        layer.closeAll();

                                        table.reload("wenjian1", option);
                                        layer.msg("删除成功");
                                    } else {
                                        layer.msg("删除失败");
                                    }
                                },
                            });
                        });

                        break;
                }
            });
        });

        function chaxun() {
            var data = form.val("saixuan");
            option.where.projectDepartmentId = data.xiangmuId;
            option.where.majorId = data.zhuanyeId;
            option.where.teamId = data.banzuId;
            option.where.installationAreaId = data.zhuangzhiquId;
            option.where.deviceLevel = data.jibie;
            option.where.state = data.state;
            option.where.keywords = data.keyWords;
            table.reload("wenjian1", option);
        }
        function shanchu() {
            console.log(333);

        }

        function daoru() {
        }

        function goEdit(data) {
            console.log(data);
            layer.open({
                title: "编辑包机信息",
                content: `
                <div style="padding:20px 30px 0 30px;" id="bianji">
                    <form class="layui-form" lay-filter="bianji" action="">
<div class="layui-form-item">
    <label class="layui-form-label right">装置区：</label>
    <label class="layui-form-label left">` +
                    data.zhuangzhiqu +
                    `</label>
</div>

<div class="layui-form-item">
    <label class="layui-form-label right">设备位号：</label>
    <label class="layui-form-label left">` +
                    data.tagnumber +
                    `</label>
</div>
<div class="layui-form-item">
    <label class="layui-form-label right">项目部：</label>
    <label class="layui-form-label left">` +
                    data.xiangmubu +
                    `</label>
</div>
<div class="layui-form-item">
    <label class="layui-form-label right">专业：</label>
    <label class="layui-form-label left">` +
                    data.zhuanye +
                    `</label>
</div>
<div class="layui-form-item">
    <label class="layui-form-label right">班组：</label>
    <label class="layui-form-label left">` +
                    data.banzu +
                    `</label>
</div>



<div class="layui-form-item">

    <label class="layui-form-label">包机人：</label>
    <div class="layui-input-block">
        <select id="user" name="userId" lay-verify="required" lay-filter="user">
                                    <option value="">请选择包机人</option>
                                </select>
    </div>
</div>
<div class="layui-form-item">
    <label class="layui-form-label">手机号：</label>
    <div class="layui-input-block">
        <input type="tel"  autocomplete="off" class="layui-input"
         value='` +
                    data.phone +
                    `'   placeholder="请输入手机号">
    </div>
</div>
</form>
</div>`,
                // name="phone" lay-verify="required|phone"
                offset: "auto",
                area: ["430px", "600px"],
                success: function () {


                },
                btn: ["保存", "取消"],
                btnAlign: "c",
                btn1: function () {
                    var data2 = form.val("bianji");

                    if (data2.userId !== "") {
                        data2.id = data.id;
                        $.ajax({
                            url: url + "machineOwner/Update",
                            data: data2,
                            method: "post",
                            success: function (data) {
                                console.log(data);
                                if (data.code === 200) {
                                    layer.closeAll();
                                    table.reload("wenjian1", option);
                                    layer.msg("修改成功");
                                } else {
                                    layer.msg("修改失败");
                                }
                            },
                            error: function (err) {
                                layer.msg("修改失败");
                            },
                        });
                    } else {
                        layer.tips("请完善信息", "#bianji");
                    }
                },

                btn2: function () { },
            });
        }
    </script>
</body>
<style scoped>
    .right {
        text-align: right;
    }

    .left {
        text-align: left;
    }

    .dv {
        height: 120px;
    }

    .layui-upload-drag {
        line-height: initial;
    }

    .layui-layer-content {
        text-align: center;
    }
</style>

</html>